<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"  style="height: 100%;width: 100%">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <style type="text/css">

        body{
            background-image: url(img/login.png) ;
            filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";
            -moz-background-size: 100% 100%;
            background-size: 100% 100%;

        }
    </style>
</head>
<body  style="height:99%;width: 100%">
<!--系统启动加载的主页面-->
<div  style="border-radius:15px;width: 40%;height: 60%;background-color: #00FF00;position: absolute;top: 20%;left:30%; background: #ededed;border:2px solid #208ee3;text-align: center " >
            <div style="margin-top: 4%">
                <span style="text-align: center; font-weight:900;margin-top:60%;font-size:2vw;color: #389bff;text-shadow:#0d17aa 2px 2px 2px;">系统授权管理</span>
            </div>
            <div class="" style="width:100%;height: 8%;margin-top: 5%" >
                <input style="border: 1px solid dodgerblue;width: 80%; height:100% "  type="text" id="ma" required  placeholder="申请码" >
            </div>
             <div class="layui-form" style="width:100%;height: 8%;margin-top: 2%;text-align: left;margin-left: 10%" >
                 <input style="margin-left: 0px" type="radio" name="sex" value="1" title="试用期" checked="" lay-filter="formDemo">
                 <input type="radio" name="sex" value="2" title="永久" lay-filter="formDemo">
            </div>
            <div class="" style="width:100%;height: 6%;margin-top:1%;text-align: left;margin-left: 10%;" >

                <div  class="" style="width: 39%;height: 100%;  float: left;border: 1px solid dodgerblue">
                    <select style="width: 100%; height:100% ;float: left;border: none" id="menu">
                        <option value="0">授权系统</option>
                        <option  value="index">登录授权</option>
                        <option value="miJiJia">智能密集架管理系统</option>
                        <option value="huiZhuanGui">智能回转柜管理系统</option>
                        <option value="shuZiHua">智慧数字化管理系统</option>
                        <option value="huanJing">智能环境管理系统</option>
                        <option value="shuJuZhongDuan">数据终端展示系统</option>
                        <option value="menJin">智能门禁管理系统</option>
                        <option value="jianKong">视频监控管理系统</option>
                        <option value="xiaoFang">消防报警管理系统</option>
                        <option value="jingHuaXiaoDu">消毒净化管理系统</option>
                        <option value="louShui">漏水报警管理系统</option>
                        <option value="dianYuan">电源监控管理系统</option>
                        <option value="dengGuang">智能灯光管理系统</option>
                        <option value="chuangLian">智能窗帘管理系统</option>
                        <option value="rfid">RFID管理系统</option>
                        <option value="xinFen">新风管理系统</option>
                        <option value="rfidWJG">RFID文件柜管理系统</option>
                        <option value="renShiGui">人事档案管理系统</option>
                        <option value="dianZiDangAn">电子档案管理系统</option>
                        <option value="rfidGuanLi">智能RFID管理系统</option>
                        <option value="baoJingGuanLi">报警信息管理</option>

                    </select>
                </div>
                <div id="date" class="" style="width:39%;height: 100%;  float: left;border: 1px solid dodgerblue;margin-left: 2%">
                    <input style="border:none; width: 100%; height:100% " type="text" id="shijian" required  placeholder="有效期" >
                </div>
            </div>

             <div id="texts" class="" style="color: #0C0C0C; text-align: center;width: 80%;height: 30%;margin-top: 2%;margin-left: 10%">
                <textarea id="textarea" style="width:100%;height: 100% ">
                </textarea>
              </div>
            <div class="" style="text-align: center;width: 100%;height: 20%;margin-top: 3%">
                <button type="submit" style="background: #1c65ff;width: 35%; border-radius:15px"  id="layui-btn" class="layui-btn" lay-filter="formDemo">生成授权码</button>
            </div>

</div>
<link rel="stylesheet" type="text/css" th:href="@{/layui/css/layui.css}">
<script th:src="@{/js/jquery-3.5.1.js}" th:inline="none"></script>
<script th:src="@{/layui/layui.all.js}" th:inline="none"></script>
<!--引入时间插件-->
<script th:src="@{/layui/layDate-v5.0.9/laydate/laydate.js}" th:inline="none"></script>
<link rel="stylesheet" th:src="@{/layui/layDate-v5.0.9/laydate/theme/default/laydate.css}" th:inline="none">

<script>

    /*$.ajax({
        url: "http://" + "127.0.0.1:8087" + "/congQi",
        type: 'POST',
    })*/


    function getEPC(){
        $.ajax({//获取所有库房
            url :"http://" + "127.0.0.1:8085" + "/getEPC",
            type : 'POST',
            dataType : 'JSON',
            success : function (data) {
                console.log(data)
                alert(data.epc);
            }
            ,error:function(){//失败回调方法
                alert("读/写器插件异常");
            }
        });
    }


    /*校验文本框的内容是否为空，用lay-verify="required"属性设置为必填*/
    layui.use(['form', 'layedit', 'laydate','element'], function () {
        var form = layui.form
            , laydate = layui.laydate
            , layer = layui.layer;
       // layer.msg($("#pro").val());

        //常规用法
        laydate.render({
            elem: '#shijian'
        });
        var type=1;
        form.on('radio(formDemo)', function(data){
            console.log(data.elem); //得到radio原始DOM对象
            console.log(data.value); //被点击的radio的value值
            if(data.value==1){
                $("#date").show()
                type=1;
            }else {
                type=2;
                $("#date").hide()
            }
        });
        $("#layui-btn").click(function(){
           // getEPC();
            var ma= $("#ma").val()
            var shijian= $("#shijian").val()
            var menu= $("#menu").val()
            var bool=true;

            if(ma==null||ma==""){
                layer.msg("填写授权码！",{//提示信息
                    time:1500,//设置1500毫秒刷新
                })
                bool=false;
                return;
            } if(menu=="0"){
                layer.msg("选择授权功能！",{//提示信息
                    time:1500,//设置1500毫秒刷新
                })
                bool=false;
                return;
            }
            if(type==1){
               if(shijian==null||shijian==""){
                   layer.msg("输入有效期！",{//提示信息
                       time:1500,//设置1500毫秒刷新
                   })
                   bool=false;
                   return;
               }
            }
            if(bool){
                $.ajax({//获取所有库房
                    url :'login',
                    type : 'POST',
                    dataType : 'JSON',
                    data:{
                        ma:ma,
                        shijian:shijian,
                        menu:menu,
                        type:type
                    },
                    success : function (data) {
                        console.log(data.msg)
                        $("#texts").show()
                        $("#textarea").text(data.msg)
                    }
                });
            }

        });
    });
</script>

</body>
</html>